{% load staticfiles %}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>BMS</title>
    <link rel="alternate" type="application/rss+xml" title="BMS" href="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="Dan Claudiu Pop">

    <!-- Le styles -->
    <link rel="stylesheet" type="text/css" href="{% static 'bets/css/style_bms.css' %}">
    <link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css">
    <link rel="stylesheet" type="text/css" href="{% static 'bets/css/font-awesome.min.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'bets/css/style.css' %}">


    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="/static/ico/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/static/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/static/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/static/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="/static/ico/apple-touch-icon-57-precomposed.png">
  </head>

  <body>
    <a name="top"></a>
    <div class="navbar navbar-fixed-top m-header">
      <div class="navbar-inner m-inner">
        <div class="container-fluid">
          <a class="brand" href="{% url 'bets:game_view' %}">
            <i class="icon-beaker icon-large"></i> BMS
            <small style="font-size:55%">Make bets and enjoy!</small>
          </a>
          
		  {% block search %}{% endblock %} 
          
        </div>
      </div>
    </div>
    
    
   	{% block sidebar %}

    <aside class="sidebar">
      <ul class="nav nav-tabs nav-stacked">
        <li class="{% ifequal page_type 'highlight_index' %}active{% endifequal %}">
          <a href="{% url 'bets:game_view' %}">
            <div>
              <i class="icon-home icon-3x"></i>
              <div class="title">
                Home
              </div>
            </div>

           <div class="arrow">
              <div class="bubble-arrow-border"></div>
              <div class="bubble-arrow"></div>
            </div>
          </a>
        </li>

        <li class="{% ifequal page_type 'highlight_archive' %}active{% endifequal %}">
          <a href="{% url 'bets:balance_view' %}">
            <div>
               <i class="icon-folder-close icon-3x"></i>
              <div class="title">
                Balance
              </div>
            </div>

            <div class="arrow">
              <div class="bubble-arrow-border"></div>
              <div class="bubble-arrow"></div>
            </div>
          </a>
        </li>

        <li class="{% ifequal page_type 'highlight_category' %}active{% endifequal %}">
          <a href="{% url 'bets:logout_view' %}">
            <div>
			  <i class="icon-calendar icon-3x"></i>            
              <div class="title">
                Log out
              </div>
            </div>
          </a>
        </li>
        
      </ul>
    </aside>
    
	{% endblock %}
    

    <div class="main-container">
      <div class="container-fluid">
        {% block content %}{% endblock %}
      </div>
    </div>

    <footer>
      <div class="container">
        <div class="row">
          <div class="span12">
            <p class="footer-extra">
            powered by <a href="https://www.djangoproject.com/">django</a>
            / <a href="http://code.google.com/p/b-m-s/">source code</a> on
              <span style="color: #777">
                <i class="icon-github icon-2x"></i>
              </span>
            </p>
          </div>
      </div>
    </footer>

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/bootstrap.min.js"></script>
    <script type="text/javascript" src="{{ STATIC_URL }}js/bootstrapx-clickover.js"></script>
    <script>
      $('[rel="clickover"]').clickover({ onShown: function() {
        $('.popover.clickover').css({'width': 'auto'});},
        html: true,
      });
    </script>
    <script>
      $(document).ready(function() {
        $('a[href=#top]').click(function(){
          $('html, body').animate({scrollTop:0}, 'fast');})
      });
    </script>
  </body>
</html>
